{% extends "base.html" %}
{% set title = "编辑会员信息" if member.mb_id else "成员资格" %}

{% block head %}
    <script src="//t1.daumcdn.net/mapjsapi/bundle/postcode/prod/postcode.v2.js" async></script>
    <script src="{{ url_for('static', path='js/jquery.register_form.js') }}"></script>
{% endblock head %}

{% block title %}{{ title }}{% endblock title %}
{% block subtitle %}{{ title }}{% endblock subtitle %}

{% block content %}
<div class="register">
    <form id="fregisterform" class="mb-4 py-3" name="fregisterform" action="{{ form.action_url }}"
          onsubmit="return fregisterform_submit(this)" method="post" enctype="multipart/form-data" autocomplete="off">
        <input type="hidden" name="is_register" value="{{ is_register }}"/>
        <input type="hidden" name="token" value="">
<!--        <input type="hidden" name="cert_type" value="">-->
<!--        <input type="hidden" name="cert_no" value="">-->
        <input type="hidden" name="mb_sex" value="">

        <div id="register_form" class="form_01 main-border rounded-3 p-5">
            <div class="register_form_inner w-100" style="max-width: 500px;">
                <h2 class="m-0 pt-0 pb-5 px-0 main-font fw-bold">输入站点使用信息</h2>
                <ul>
                    <li class="position-relative pt-4 main-font">
                        <input type="text" name="mb_id" value="{{ member.mb_id|default('', true) }}"
                               id="reg_mb_id" required class="frm_input full_input required alnum_" minlength="3"
                               maxlength="20"
                               {% if member.mb_id %}readonly="readonly"{% endif %}
                               placeholder="">
                        <label for="reg_mb_id" class="text_input d-block">
                          Idie (必不可少的)
                          <button type="button" class="tooltip_icon">
                              <i class="fa fa-regular fa-question-circle" aria-hidden="true"></i>
                              <span class="blind">见说明</span>
                              <span class="tooltip_bb">英文字符, 编号, _ 仅输入. 最小值 3请输入多个.</span>
                          </button>
                        </label>
                        <span id="msg_mb_id"></span>
                    </li>
                    <li class="left_input margin_input position-relative pt-4 main-font">
                      <input type="password" name="mb_password" id="reg_mb_password"
                      {{ "required" if is_register else None }}
                       class="frm_input full_input {% if is_register %} required {% endif %}" minlength="4" maxlength="20" placeholder="">
                        <label for="reg_mb_password" class="text_input">密码 (必不可少的)</label>
                    </li>
                    <li class="left_input position-relative pt-4 main-font">
                      <input type="password" name="mb_password_re" id="reg_mb_password_re"
                        {% if is_register %} 'required' {% endif %}
                        class="frm_input full_input
                        {% if is_register %} required {% endif %}" minlength="4" maxlength="20" placeholder="">
                        <label for="reg_mb_password_re" class="text_input">检查您的密码 (必不可少的)</label>
                    </li>
                </ul>
            </div>

            <div class="tbl_frm01 tbl_wrap register_form_inner rounded-2 w-100" style="max-width: 500px;">
                <h2 class="m-0 pt-5 pb-4 px-0 main-font fw-bold">个人信息输入</h2>
                <ul class="pt-3">
                    <li class="position-relative pt-4 main-font">
                        <input type="text" id="reg_mb_name" name="mb_name"
                               value="{{ member.mb_name|default('', true) }}" 
                               required 
                               {{ form.name_readonly }}
                               class="frm_input full_input required " size="10" placeholder="">
                        <label for="reg_mb_name" class="text_input">姓名 (必不可少的)</label>
                    </li>
                    <li class="position-relative pt-4 main-font">
                        <input type="text" name="mb_nick" value="{{ member.mb_nick|default('', true) }}"
                               id="reg_mb_nick" required class="frm_input required nospace full_input" size="10"
                               maxlength="20" placeholder="">
                        <label for="reg_mb_nick" class="text_input">
                          昵称 (必不可少的)
                          <button type="button" class="tooltip_icon">
                              <i class="fa fa-regular fa-question-circle" aria-hidden="true"></i>
                              <span class="blind">见说明</span>
                              <span class="tooltip_bb">不带空格的朝鲜文,英语,只能输入数字 (朝鲜文2成, 英语4超过)<br> 如果你改变你的昵称， 60天内无法更改.</span>
                          </button>
                        </label>
                        <span id="msg_mb_nick"></span>
                    </li>
                    <li class="position-relative pt-4 main-font">
                        <input type="hidden" name="old_email" value="">
                        <input type="text" name="mb_email" value="{{ member.mb_email|default('', true) }}"
                              id="reg_mb_email" required class="frm_input email full_input required" size="70"
                              maxlength="100" placeholder="">
                        <label for="reg_mb_email" class="text_input">E-mail (必不可少的)</label>
                        {% if config.cf_use_email_certify %}
                            {% if is_register %}
                                <span class="frm_info">E-mail 确认发送到的内容后，必须验证您的会员资格。.</span>
                            {% else %}
                                <span class="frm_info">E-mail 如果您更改地址，则必须重新进行身份验证.</span>
                            {% endif %}
                        {% endif %}
                    </li>

                    {% if config.cf_use_homepage %}
                    <li>
                        <label for="reg_mb_homepage" class="blind">主页{% if config.cf_req_homepage %} (必不可少的){% endif
                            %}</label>
                        <input type="text" name="mb_homepage" value="{{ member.mb_homepage|default('', true) }}"
                               id="reg_mb_homepage"
                               class="frm_input full_input {% if config.cf_req_homepage %} required{% endif %}"
                               maxlength="255"
                               {% if config.cf_req_homepage %} required {% endif %}
                               placeholder="主页{% if config.cf_req_homepage %} (必不可少的){% endif %}">
                    </li>
                    {% endif %}
                    {% if config.cf_use_tel %}
                    <li>
                        <label for="reg_mb_tel" class="blind">电话号码
                            {% if config.cf_req_tel %} (必不可少的) {% endif %}
                        </label>
                        <input type="text" name="mb_tel" value="{{ member.mb_tel|default('', true) }}"
                               id="reg_mb_tel"
                               class="frm_input full_input {% if config.cf_req_tel %} required{% endif %}"
                               maxlength="20"
                               {% if config.cf_req_tel %}required{% endif %}
                               placeholder="电话号码 {% if config.cf_req_tel %} (必不可少的){% endif %}">
                    </li>
                    {% endif %}

                    {% if config.cf_use_hp %}
                    <li>
                        <label for="reg_mb_hp" class="blind">
                            移动电话号码{% if config.cf_req_hp %} (必不可少的){% endif %}{{ desc_phone }}
                        </label>
                        <input type="text" name="mb_hp"
                               id="reg_mb_hp" 
                               {{ hp_readonly }}
                               value="{{ member.mb_hp|default('', true) }}"
                               class="frm_input full_input 
                               {% if config.cf_req_hp %}required{% endif %}
                               {{ hp_readonly }}"
                               maxlength="20"
                               placeholder="移动电话号码{% if config.cf_req_hp %} (必不可少的){% endif %} {{ desc_phone }}"
                        >
                    </li>
                    {% endif %}
                    
                    {% if config.cf_use_addr %}
                    <li>
                        <label>地址 {% if config.cf_req_addr %} (必不可少的) {% endif %}</label> 
                        <label for="reg_mb_zip" class="blind">
                            邮政号码 {% if config.cf_req_addr %} (必不可少的) {% endif %}
                        </label>
                        <input type="text" name="mb_zip" 
                               value="{{ member.mb_zip1|default('', true) + member.mb_zip2|default('', true) }}"
                               id="reg_mb_zip"
                               {% if config.cf_req_addr %} required {% endif %}
                               class="frm_input twopart_input {% if config.cf_req_addr %} required {% endif %}"
                               size="5" maxlength="6" placeholder="邮政号码">
                               size="5" maxlength="6" placeholder="邮政号码">
                        <button type="button" class="btn_frmline"
                                onclick="win_zip('fregisterform', 'mb_zip', 'mb_addr1', 'mb_addr2', 'mb_addr3', 'mb_addr_jibeon');">
                            搜索地址
                        </button>
                        <br>
                        <input type="text" name="mb_addr1" value="{{ member.mb_addr1|default('', true) }}"
                               id="reg_mb_addr1" 
                               {% if config.cf_req_addr %} required {% endif %} 
                               class="frm_input frm_address full_input 
                               {% if config.cf_req_addr %} required {% endif %}"
                               size="50"
                        placeholder="基本地址">
                        <label for="reg_mb_addr1"
                               class="blind">基本地址  {% if config.cf_req_addr %} (必不可少的) {% endif %}  </label><br>
                        <input type="text" name="mb_addr2" value="{{ member.mb_addr2|default('', true) }}"
                               id="reg_mb_addr2" class="frm_input frm_address full_input" size="50" placeholder="详细地址">
                        <label for="reg_mb_addr2" class="blind">详细地址</label>
                        <br>
                        <input type="text" name="mb_addr3" value="{{ member.mb_addr3|default('', true) }}"
                               id="reg_mb_addr3" class="frm_input frm_address full_input" size="50" readonly="readonly"
                               placeholder="备注项目">
                        <label for="reg_mb_addr3" class="blind">备注项目</label>
                        <input type="hidden" name="mb_addr_jibeon"
                               value="{{ member.mb_addr_jibeon|default('', true) }}">
                    </li>
                    {% endif %}
                </ul>
            </div>

            <div class="tbl_frm01 tbl_wrap register_form_inner w-100" style="max-width: 500px;">
                <h2 class="m-0 pt-5 pb-4 px-0 main-font fw-bold">其他个人设置</h2>
                <ul class="fs-5 main-font">
                    
                    {% if config.cf_use_signature %}
                    <li>
                        <label for="reg_mb_signature" class="blind">
                            签名 {% if config.cf_req_signature %} (必不可少的){% endif %}
                        </label>
                        <textarea name="mb_signature" id="reg_mb_signature"
                                  class=" {% if config.cf_req_signature %} required {% endif %}"
                                  {% if config.cf_req_signature %} required {% endif %}
                                  placeholder="签名 {% if config.cf_req_signature %} (必不可少的){% endif %}">{{ member.mb_signature|default('', true) }}</textarea>
                    </li>
                    {% endif %}
                    {% if config.cf_use_profile %}
                    <li>
                        <label for="reg_mb_profile" class="blind">自我介绍</label>
                        <textarea name="mb_profile" id="reg_mb_profile"
                                  class="{% if config.cf_req_profile %} required{% endif %}" 
                                  {% if config.cf_req_profile %} required {% endif %}
                                  placeholder="自我介绍{% if config.cf_req_profile %} (必不可少的){% endif %}">{{ member.mb_profile|default('', true) }}</textarea>
                    </li>
                    {% endif %}
                    
                    {% if config.cf_icon_level|int <= member.mb_level|int %}
                    <li class="reg_mb_img_file">
                        <label for="reg_mb_img" class="frm_label">
                            成员图像
                            <button type="button" class="tooltip_icon">
                              <i class="fa fa-regular fa-question-circle" aria-hidden="true"></i>
                              <span class="blind">见说明</span>
                              <span class="tooltip_bb">图像大小在侧面 {{ config.cf_member_img_width }} 像素, 详图 {{ config.cf_member_img_height }}它是用像素调整大小.<br>
                                gif, jpg, png仅文件和容量 {{ config.cf_member_img_size }}只有小于字节的将被注册.</span>
                            </button>
                        </label>
                        <input type="file" name="mb_img" accept="image/*" id="reg_mb_img">
                        
                        {% if not is_register and form.mb_img_url %}
                            <img src="{{ form.mb_img_url }}" alt="">
                            <input type="checkbox" name="del_mb_img" value="1" id="del_mb_img">
                            <label for="del_mb_img" class="inline">删除</label>
                        {% endif %}
                    </li>
                    <li class="reg_mb_icon_file main-bt pt-5">
                        <label for="reg_mb_icon" class="frm_label">
                            成员图标
                            <button type="button" class="tooltip_icon">
                              <i class="fa fa-regular fa-question-circle" aria-hidden="true"></i>
                              <span class="blind">见说明</span>
                              <span class="tooltip_bb">图像大小在侧面 {{ config.cf_member_icon_width }} 像素, 详图 {{ config.cf_member_icon_height }}它是用像素调整大小.<br>
                                gif, jpg, png仅文件和容量 {{ config.cf_member_icon_size }}只有小于字节的将被注册.</span>
                            </button>
                        </label>
                        <input type="file" name="mb_icon" accept="image/*" id="reg_mb_icon">
                        {% if not is_register and form.mb_icon_url %}
                            <img src="{{ form.mb_icon_url }}" alt="" width="{{ config.cf_member_icon_width }}" height="{{ config.cf_member_icon_height }}">
                            <input type="checkbox" name="del_mb_icon" value="1" id="del_mb_icon">
                            <label for="del_mb_icon" class="inline">删除</label>
                        {% endif %}
                    </li>
                    
                    {% endif %}
                    
                    <li class="chk_box">
                        <input type="checkbox" name="mb_mailling" value="1"
                               id="reg_mb_mailling" 
                               {% if member.mb_mailling %} checked {% endif %}
                               class="selec_chk"
                        >
                        <label for="reg_mb_mailling">
                            <span></span>
                            <b class="blind">铣削服务</b>
                        </label>
                        <span class="chk_li ps-4">我将收到一封信息邮件.</span>
                    </li>
                    
                    {% if config.cf_use_hp %}
                    <li class="chk_box">
                        <input type="checkbox" name="mb_sms" value="1"
                               id="reg_mb_sms"
                               {% if member.mb_sms %} checked {% endif %}
                               class="selec_chk"
                        >
                        <label for="reg_mb_sms">
                            <span></span>
                            <b class="blind">SMS 是否接收</b>
                        </label>
                        <span class="chk_li ps-4">我会收到手机短信。.</span>
                    </li>
                    {% endif %}
                    
                    {% if form.is_profile_open %}
                    <li class="chk_box">
                        <input type="checkbox" name="mb_open" value="1"
                               id="reg_mb_open"
                               {% if is_register or member.mb_open %} checked {% endif %}
                               class="selec_chk"
                        >
                        <label for="reg_mb_open">
                            <span></span>
                            <b class="blind">信息披露</b>
                        </label>
                        <span class="chk_li ps-4">我让别人看到我的信息。.</span>
                        <span class="frm_info">
                            如果你改变了信息披露， {{ config.cf_open_modify|default("0") }}几天之内没有变化。.
                        </span>
                    </li>
                    {% else %}
                    <li>
                        <span class="frm_label">信息披露</span>
                        <input type="hidden" name="mb_open" value="{{ member.mb_open }}">

                        <span class="frm_info">
                            更正后的信息发布 {{ config.cf_open_modify|default("0") }} 天内, 
                            {{ form.profile_open_date }} 我们不能改变，直到。.<br>
                            这样做的原因是为了防止由于频繁的信息披露更正，您在发送后没有收到通知。.
                        </span>
                         
                    </li>
                    {% endif %} 
                    {% if is_register and config.cf_use_recommend %}
                    <li>
                        <input type="text" name="mb_recommend" 
                               value="" 
                               id="mb_recommend" 
                               class="frm_input half_input" 
                               placeholder="推荐ID">

                    </li>
                    {% endif %}
                    <li>
                    </li>

                    <li class="is_captcha_use">
                        {% include captcha_widget(request) ignore missing %}
                    </li>
                </ul>
            </div>
        </div>
        <div class="btn_confirm d-flex justify-content-center align-items-center w-100 fs-5 text-end">
            <a href="/" class="btn_close px-5 me-2" style="height: 45px;">取消</a>
            <button type="submit" id="btn_submit" class="btn_submit" accesskey="s">{% if is_register %}会员{% else %}信息更正{% endif %}</button>
            <button type="submit" id="btn_submit" class="btn_submit" accesskey="s">{% if is_register %}会员{% else %}信息更正{% endif %}</button>
        </div>
    </form>
</div>
<script>
    "use strict";
    $(function() {
        $("#reg_zip_find").css("display", "inline-block");
        const pageTypeParam = "pageType=register";
    });
    
    // submit 最终形式检查
    function fregisterform_submit(f)
    {
        try {
        {% if is_register %}
            // 成员姓名检查
            let valid_id = valid_register_field("id", f.mb_id.value)
            if (valid_id.success === false) {
                alert(valid_id.message);
                f.mb_id.focus();
                return false;
            }

            // 名称检查
            if (f.mb_name.value.length < 1) {
                alert("请输入名称.");
                f.mb_name.focus();
                return false;
            }
            let valid_name = valid_register_field("name", f.mb_name.value)
            if (valid_name.success === false) {
                alert(valid_name.message);
                f.mb_name.focus();
                return false;
            }
        {% endif %}

            // 检查密码
            if (typeof(f.mb_password) != "undefined" && f.mb_password.value) {
                if (f.mb_password.value.length < 4 || f.mb_password.value.length > 20) {
                    alert("密码是 4~20我要你进入.");
                    f.mb_password.focus();
                    return false;
                }
                if (f.mb_password.value != f.mb_password_re.value) {
                    alert("密码检查不匹配.");
                    f.mb_password_re.focus();
                    return false;
                }
            }

            // Nicknname检查
            if (f.mb_nick.defaultValue != f.mb_nick.value) {
                let valid_nickname = valid_register_field("nickname", f.mb_nick.value)
                if (valid_nickname.success === false) {
                    alert(valid_nickname.message);
                    f.reg_mb_nick.focus();
                    return false;
                }
            }

            // E-mail 检查
            if (f.mb_email.defaultValue != f.mb_email.value) {
                let valid_email = valid_register_field("email", f.mb_email.value)
                if (valid_email.success === false) {
                    alert(valid_email.message);
                    f.reg_mb_email.focus();
                    return false;
                }
            }

            // 成员图标,图像扩展检查
            if (typeof f.mb_icon != "undefined") {
                if (f.mb_icon.value) {
                    if (!f.mb_icon.value.toLowerCase().match(/.(gif|jpe?g|png)$/i)) {
                        alert("成员图标不是图像文件.");
                        f.mb_icon.focus();
                        return false;
                    }
                }
            }
            if (typeof f.mb_img != "undefined") {
                if (f.mb_img.value) {
                    if (!f.mb_img.value.toLowerCase().match(/.(gif|jpe?g|png)$/i)) {
                        alert("成员图像不是图像文件.");
                        f.mb_img.focus();
                        return false;
                    }
                }
            }

            // 推荐人的检查
            if (typeof(f.mb_recommend) != "undefined" && f.mb_recommend.value) {
                if (f.mb_id.value == f.mb_recommend.value) {
                    alert("我不能推荐你。.");
                    f.mb_recommend.focus();
                    return false;
                }
                const regex_recommend = /[^0-9a-z_]+/i;
                if (regex_recommend.test(f.mb_recommend.value)) {
                    alert("推荐人的名字是英文字符, 编号, _ 仅输入.");
                    f.mb_recommend.focus();
                    return false;
                }
                let valid_recommend = valid_register_field("recommend", f.mb_recommend.value)
                if (valid_recommend.success === false) {
                    alert(valid_recommend.message);
                    f.mb_recommend.focus();
                    return false;
                }
            }

            // captcha 使用时
            if (typeof check_captcha === "function") {
                if (!check_captcha(f)) return false;
            }

            document.getElementById("btn_submit").disabled = true;

            // Totkin生成是在表单检查的最后进行的.
            f.token.value = generate_token();
            
            return true;
        
        } catch(e) {
            console.log(e)
            alert('我没能加入会员')
            return false;
        }
    }
    
    jQuery(function($){
        //tooltip
        $(document).on("click", ".tooltip_icon", function(e){
            $(this).next(".tooltip").fadeIn(400).css("display","inline-block");
        }).on("mouseout", ".tooltip_icon", function(e){
            $(this).next(".tooltip").fadeOut();
        });
    });
</script>
{% endblock content %}